<template>
  <div class="wrap">
  		<div class="app-header"><header-v></header-v></div>
  		
  		<div class="app-content">
  			<div class="content_01">
  				<div class="contents" v-for="item in content_1">
	  					<div class="title">
	  						<a href="javascript:;" @click="shake">{{ item.title }}</a>
	  					</div>
	  					<div class="con"> {{ item.con }} </div>
	  			</div>
  				<div class="dazao" v-for="item in dazao">
  						{{ item.con1 }} <br/> {{ item.con2 }}
  				</div>
  			</div>
  			
  			<div class="content_02">
  				<p class="title">六大亮点 <br />——势力巨子高效、行业优秀</p>
  				<panel :list="content_2" :type="type" class="panels"></panel>
  			</div>
  			
  			<div class="content_03">
  				<p class="title">八大效益<br /><span>———引领全局、共筑扛鼎</span></p>
  				<panel :list="content_3" :type="type"></panel>
  			</div>
  		</div>
  		
  		<div class="app-footer"><footer-v></footer-v></div>
  </div>
</template>

<script>
import header from '../public/header'
import footer from '../public/footer'
import { Panel } from 'vux'

import src_1 from '../../assets/con_icon_01.gif'
import src_2 from '../../assets/con_icon_02.gif'
import src_3 from '../../assets/con_icon_03.gif'
import src_4 from '../../assets/con_icon_04.gif'
import src_5 from '../../assets/con_icon_05.gif'
import src_6 from '../../assets/con_icon_06.gif'
import src_7 from '../../assets/con_icon_07.gif'
import src_8 from '../../assets/con_icon_08.gif'
import src_9 from '../../assets/con_icon_09.gif'
import src_10 from '../../assets/con_icon_10.gif'
import src_11 from '../../assets/con_icon_11.gif'
import src_12 from '../../assets/con_icon_12.gif'
import src_13 from '../../assets/con_icon_13.gif'
import src_14 from '../../assets/con_icon_14.gif'

export default {
	
  components: {	
		headerV : header,
		footerV : footer,
		Panel
  },
  data () {
    return {
    	type : '1',
  		content_1 : [
  			{
  				title : '关于展会',
  				con : ' 历经十载，上海绿色食品及有机食品展览会已经发展成为华东区域乃至全国的一个行业品牌展会。从2006 年3000 平方米,100多家参展企业,9000多名观众起步,到2015年，20,000平米,来自20个国家和地区的400多家参展企业，以及来自30多个国家和地区的30,000多名专业观众。上海绿色食品及有机食品展览会旨在发展我国绿色有机事业，展商可以与采购商面对面的交流，增进友谊，推动供需双方合作共赢，为中国绿色有机食品行业健康发展保驾护航。同时也为众多实力企业打造强势品牌、传播优质形象、塑造良好美誉、推介产品的优质平台。'
  			},
  			{
  				title : '往届回顾',
  				con : '上届举办的绿色食品及有机食品展，共吸引来自全球二十多个国家和地区400多家绿色有机食品的优质供应商前来参展，参展企业包括广西展团、柬埔寨展团、越南展团、泰国展团、台湾展团、韩国展团、良友集团、南京完美江南农业、汉中御臻农业、北大荒集团、上海华润五丰、中粮集团等众多国内外知名企业。集齐国内外近万名绿色有机食品领域的专业买家参会。展会期间多场活动论坛也引起众多关注'
  			},
  			{
  				title : '宣传阵容',
  				con : '会前我们将携手新华社、人民日报、CCTV、中央人民广播电台、东方卫视、浙江卫视、第一财经、经济日报、人民日报、百度、360、新浪网、搜狐网、人民网、新华网、阿里巴巴等上百家权威媒体对此次展会进行全方位多角度的宣传报道。'
  			}
  		],
  		dazao : [
  			{
  				con1 : ' 打造亚洲最具影响力的绿色有机食品展',
　					con2 : '——不单单是有机，更多是有机会'
  			}
  		],
  		content_2 : [
  			{
  				src : src_1,
  				title : '势力巨子举行',
  				desc : '上海市粮油学会核准、中国食人格业协会举行的行业势力巨子盛会。'
  			},
  			{
  				src : src_2,
  				title : '局限超前',
  				desc : '近40000平方，高出1500个尺度展位，近千家厂商汇聚。'
  			},
  			{
  				src : src_3,
  				title : '勾当纷呈',
  				desc : '岑岭论坛、采购对接会、美食文化交换、经销商联谊会等勾当同期召开。'
  			},
  			{
  				src : src_4,
  				title : '地区上风',
  				desc : '上海做为泛长三角的焦点，经济商业辐射全中国及至东南亚各国。'
  			},
  			{
  				src : src_5,
  				title : '细密度的商务配对处事',
  				desc : '大会推出贴切展商的商务配对处事，开创展会过细处事新阶梯。'
  			},
  			{
  				src : src_6,
  				title : '媒体携手',
  				desc : '近1000多家专业媒体持续报道，涉及各大行业网站、报刊、电视台宣传平台，打造晋升本届展会知名度。'
  			}
  		],
  		content_3 : [
  			{
  				src : src_7,
  				title : '获取外洋定单',
  				desc : '与外洋的300余家高质量的采购商、需求商面扑面地交换，为您开辟国际市场提供好平台！'
  			},
  			{
  				src : src_8,
  				title : '贩卖内需产物',
  				desc : '与阛阓超市的120余家采购部分晤面，按照内需开辟海内市场，贩卖产物。'
  			},
  			{
  				src : src_9,
  				title : '晋升品牌代价',
  				desc : '展示品牌形象，晋升行业职位，晋升代价度、知名度及美誉度。'
  			},
  			{
  				src : src_10,
  				title : '获得媒体存眷',
  				desc : '近百家专业及公共媒体到会，新产物获得存眷并接管专访。'
  			},
  			{
  				src : src_11,
  				title : '拓展贩卖渠道',
  				desc : '获取、会谈、确定隐藏客户、署理商、批发商。'
  			},
  			{
  				src : src_12,
  				title : '维护贩卖收集',
  				desc : '与新老客户晤面，维护、增强您的贩卖收集。'
  			},
  			{
  				src : src_13,
  				title : '相识市场信息',
  				desc : '直面终端斲丧者，相识新品上市前的市场反馈信息，快地获取市场动态。'
  			},
  			{
  				src : src_14,
  				title : '掌握成长趋势',
  				desc : '凝听国表里专家攀谈市场动态及乐成贩卖模式，判定和掌握将来成长趋势'
  			}
  		]
    }
  },
  methods : {
  	shake (ev){
  		ev.target.classList.add('shake');
			setTimeout(function (){
				ev.target.classList.remove('shake');
			},950)
  	}
  }
}
</script>


<style type="text/css">
	
	/* about.style */
	
	.weui-media-box_appmsg .weui-media-box__hd{
		width: 0.6rem !important; height: 0.6rem !important;
	}

	.content_01{
		width:100%; overflow: hidden;
	}
	.content_01 .contents{
		border-bottom:0.01rem solid rgba(119,119,119,0.5);
	}
	.content_01 .contents:nth-of-type(3){
		border: none;
	}
	.content_01 .contents .title{
		width:100%; text-align:center; margin: 0.2rem 0; 
	}
	.content_01 .contents .title a{
		display: block; width:1rem; margin: 0 auto; height: 0.38rem; color: #3d9be9; border: 2px solid #3d9be9; border-radius: 0.05rem; font-size: 0.2rem; line-height: 0.38rem;
	}
	.content_01 .contents .con{
		color:#696969; text-indent: 1.5em; line-height: 0.3rem; padding-left: 0.1rem; padding-right: 0.1rem; margin-bottom: 0.1rem;
	}
	.content_01 .dazao{
		width:100%; background-color: #f1c40f; padding: 0.15rem 0; text-align: center; color: #fff; font-size: 0.16rem; line-height: 0.4rem;
	}
	
	.content_01 .shake {
		-webkit-animation: 900ms shake linear; animation: 900ms shake linear;
	}

	
	.content_02{
		background-color: #1c4274; padding-bottom: 0.2rem;
	}
	.content_02 img{
		width:0.45rem !important; height: 0.45rem !important; margin-top: 0.1rem;
	}
	.content_02 .title{
		color: #fff; text-align: center; font-size: 0.18rem; font-weight: bold; line-height: 0.3rem; padding-top: 0.15rem;
	}
	.content_02 .weui-media-box__title{
		color: #FFD41D !important; font-size: 0.14rem !important;
	}
	.content_02 .weui-media-box__desc{
		color:rgb(135, 191, 243) !important; line-height: 0.2rem; font-size: 0.14rem;
	}
	.content_02 .weui-panel{
		background: none;
	}
	
	.content_03 .title{
			font-size: 0.18rem; text-align: center; line-height: 0.3rem; margin-top: 0.1rem;
	}
	.content_03 .title span{
		font-size: 0.12rem;
	}
	.content_03 .weui-media-box__bd h4{
		color: #000 !important; font-size: 0.17rem !important; 
	}
	.content_03 .weui-media-box__bd .weui-media-box__desc{
		color: #000 !important; font-size: 0.13rem; line-height: 0.25rem; -webkit-line-clamp:inherit;
	}
	.content_03 img{
		width: 0.32rem !important; height: 0.3rem !important;
	}
	.content_03 .weui-media-box,.content_02 .weui-media-box{
		padding:0.07rem; padding-top: 0.24rem;
	}
	.content_03 .weui-media-box:nth-of-type(8){
		margin-bottom: 0.2rem;
	}
	.weui-media-box:before{
		border: none !important;
	}
</style>
